import React from 'react';
import './settings.less';
import { Form, Breadcrumb, Input, Button, message } from 'antd';
import Config from '../common/config';
import $ from 'jquery';

const FormItem = Form.Item;
const config = new Config()
const token = sessionStorage.getItem('token');

class Setting extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            settingData: {},
            settings: '', //系统设置数据
        }
        this.validateNumber = this.validateNumber.bind(this);
    }

    componentDidMount() {
        this.getSystemsetting();
    }
    //获取系统设置
    getSystemsetting() {
        $.ajax({
            url: `${config.JuseSystem}/globalSetting/detail`,
            type: 'get',
            headers: {
                'Authorization': 'Bearer ' + token,
            },
            success: res => {
                console.log(res)
                if (res.code == 200) {
                    this.setState({
                        settings: res.data,
                    });
                } else {
                    message.error('获取系统设置信息失败', 2);
                }
            }
        })
    }

    //保存系统设置
    saveSystemsetting() {
        this.props.form.validateFields((err, values) => {
            console.log(values)
            if (!err) {
                const Data = {
                    id: this.state.settings.id,
                    buyLimit: values.ProductNumber,
                    freePostageLimit: values.IsPostage,
                    onlineBasicPostage: values.onlinePostage,
                    cashBasicPostage: values.Postage,
                }
                console.log(Data);
                $.ajax({
                    url: `${config.JuseSystem}/globalSetting/update`,
                    type: 'post',
                    headers: {
                        'Authorization': 'Bearer ' + token,
                    },
                    data: Data,
                    success: res => {
                        if (res.code == 200) {
                            message.success('保存成功');
                            this.getSystemsetting();
                        } else {
                            console.log(res);
                            message.error('获取系统设置信息失败,请重试', 2);
                        }
                    }
                })
            }
        })
    }
    //取消
    cancel() {
        this.props.form.resetFields();
    }
    //验证输入框input输入值 只能输入数字和.
    validateNumber(e) {
        e.target.value = e.target.value.replace(/[^\d]/g, ""); //只能输入整数
    }
    render() {
        const { getFieldDecorator } = this.props.form;
        const settings = this.state.settings;
        return (
            <Form>
                <div className="settings">
                    <div className="settings1">
                        <div className='spgl2-1 clearfix'>
                            <Breadcrumb separator=">">
                                <Breadcrumb.Item>首页</Breadcrumb.Item>
                                <Breadcrumb.Item><span className='separator-a'>系统设置</span></Breadcrumb.Item>
                            </Breadcrumb>
                        </div>
                        <div className='settings1-1'>
                            <FormItem style={{ minHeight: '60px', marginBottom: 10, width: "300px", }}>
                                {getFieldDecorator('ProductNumber', {
                                    rules: [{ required: true, message: '请设置购买数量限制' }],
                                    initialValue: settings.buyLimit,
                                })(
                                    <Input addonBefore="购买数量限制" placeholder="请输入" addonAfter={<i>件</i>} onChange={this.validateNumber} />
                                )}
                            </FormItem>
                            <FormItem style={{ minHeight: '60px', marginBottom: 10, width: "300px", }}>
                                {getFieldDecorator('IsPostage', {
                                    rules: [{ required: true, message: '请设置满额包邮' }],
                                    initialValue: settings.freePostageLimit,
                                })(
                                    <Input addonBefore="满额包邮" placeholder="请输入" addonAfter={<i>元</i>} onChange={this.validateNumber} />
                                )}
                            </FormItem>
                            <FormItem style={{ minHeight: '60px', marginBottom: 10, width: "300px", }}>
                                {getFieldDecorator('onlinePostage', {
                                    rules: [{ required: true, message: '请设置在线支付基础邮费' }],
                                    initialValue: settings.onlineBasicPostage,
                                })(
                                    <Input addonBefore="在线支付基础邮费" placeholder="请输入" addonAfter={<i>元</i>} onChange={this.validateNumber} />
                                )}
                            </FormItem>
                            <FormItem style={{ minHeight: '60px', marginBottom: 10, width: "300px", }}>
                                {getFieldDecorator('Postage', {
                                    rules: [{ required: true, message: '请设置货到付款基础邮费' }],
                                    initialValue: settings.cashBasicPostage,
                                })(
                                    <Input addonBefore="货到付款基础邮费" placeholder="请输入" addonAfter={<i>元</i>} onChange={this.validateNumber} />
                                )}
                            </FormItem>
                        </div>

                    </div>
                    <div className='settings1-1'>
                        <Button type="primary" className='goods-label-table-app' onClick={() => this.cancel()} style={{ color: '#fff' }}>取消</Button>
                        <Button type="primary" className='goods-label-table-app1' onClick={() => this.saveSystemsetting()}>保存</Button>
                    </div>
                </div>
            </Form>
        )
    }
}

const Systemset = Form.create()(Setting);
export default Systemset;